import './styles/index.scss';
import React, { FC } from 'react';

import Question from './Question';
import Selector from './Selector';

interface IProps {
  url: string;
  question: string;
  id: string;
  //答题选项1 正确/错误/A/B/C/D
  item1: string;
  //答题选项2 正确/错误/A/B/C/D
  item2: string;
  //答题选项3 A/B/C/D
  item3: string;
  //答题选项4 A/B/C/D
  item4: string;
  onNextQuestion: () => void;
}

const TestPanel: FC<IProps> = ({
  question,
  url,
  id,
  item1,
  item2,
  item3,
  item4,
  onNextQuestion
}) => {
  return (
    <div className="test-panel">
      <Question question={question || '加载中...'} url={url} />
      <Selector
        id={id}
        item1={item1}
        item2={item2}
        item3={item3}
        item4={item4}
        onNextQuestion={onNextQuestion}
      />
    </div>
  );
};

export default TestPanel;
